<template>
  <div class="wrap">
    <el-card class="box-card" style="height: 500px">

      <el-form :inline="true" :model="formInline" class="demo-form-inline" size="small">
        <el-form-item label="咨询师">
          <el-input v-model="formInline.teacherName" placeholder="请输入咨询师姓名"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="getStudentInfo()" size="small">查询</el-button>
          <el-button type="warning" @click="resetGetStudentInfo()" size="small">重置</el-button>

        </el-form-item>
      </el-form>
      <el-table
        :data="pagination.records"
        size="small"
        style="width: 100%">
        <el-table-column
          prop="name"
          label="姓名"
          width="180">
        </el-table-column>
        <el-table-column
          prop="teacherName"
          label="咨询师"
          width="180">
        </el-table-column>
        <el-table-column
          prop="question"
          label="问题描述"
        >
        </el-table-column>
        <el-table-column
          prop="symptom"
          label="症状">
        </el-table-column>
        <el-table-column
          prop="flag"
          width="100"
          label="状态"
          :formatter="handFlag"
        >
        </el-table-column>
        <el-table-column
          prop="createDate"
          width="180"
          label="咨询时间">
        </el-table-column>
        <el-table-column label="操作" width="100" align="center">
          <template slot-scope="scope">
            <el-button @click="view(scope.row.id)" type="primary" size="small">查看结果</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pagination.current"
        :page-sizes="[6, 10]"
        :page-size="pagination.size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pagination.total"
        class="page">
      </el-pagination>
    </el-card>


    <el-dialog
      title="咨询结果"
      :visible.sync="dialogVisible"
      width="50%">

      <el-form ref="form" :model="form" label-width="120px" disabled>

        <el-form-item label="姓名" prop="name">
          <el-input v-model="form.name"></el-input>
        </el-form-item>
        <el-form-item label="咨询师" prop="name">
          <el-input v-model="form.teacherName"></el-input>
        </el-form-item>
        <el-form-item label="年龄" prop="age">
          <el-input v-model="form.age"></el-input>
        </el-form-item>
        <el-form-item label="性别" prop="sex">
          <el-radio-group v-model="form.sex">
            <el-radio label="男"></el-radio>
            <el-radio label="女"></el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="问题描述" prop="question">
          <el-input v-model="form.question" type="textarea"></el-input>
        </el-form-item>
        <el-form-item label="主要症状" prop="symptom">
          <el-input v-model="form.symptom" type="textarea"></el-input>
        </el-form-item>
        <el-form-item label="建议" prop="idea">
          <el-input v-model="form.idea" type="textarea"></el-input>
        </el-form-item>
        <el-form-item label="结果" prop="result">
          <el-input v-model="form.result" type="textarea"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">关  闭</el-button>
  </span>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    name : "myconsult" ,
    data () {
      return {
        tableData : [] ,
        pagination : {
          //分页后的考试信息
          current : 1 , //当前页
          total : null , //记录条数
          size : 10 , //每页条数
        } ,
        form : {} ,
        dialogVisible : false,
        userId:'',
        formInline:{
          teacherName:''
        }
      }
    } ,
    created () {
      this.getStudentInfo ()
    } ,
    methods : {
      resetGetStudentInfo(){
        this.formInline.teacherName = ''
        this.getStudentInfo()
      },
      getStudentInfo () {
        this.userId = this.$cookies.get ( "cid" )
        //分页查询所有试卷信息
        this.$axios (
          {
            methods : 'get' ,
            url : '/api/consults' ,
            params : {
              page : this.pagination.current ,
              size : this.pagination.size,
              userId:this.userId,
              teacherName : this.formInline.teacherName
            }
          } ).then ( res => {
          this.pagination = res.data.data;
        } ).catch ( error => {
        } );
      } ,
      //改变当前记录条数
      handleSizeChange ( val ) {
        this.pagination.size = val;
        this.getStudentInfo ();
      } ,
      //改变当前页码，重新发送请求
      handleCurrentChange ( val ) {
        this.pagination.current = val;
        this.getStudentInfo ();
      } ,

      view ( id ) {
        this.dialogVisible = true
        this.$axios ( `/api/consult/${ id }` ).then ( res => {
          this.form = res.data.data
        } )
      },
      handFlag(rowData){
        if(rowData.flag ==='0') {
          return '未回复'
        }else{
          return '已回复'
        }
      }
    }
  }
</script>

<style scoped>
  .wrap {
    width: 85%;
    margin: 30px auto;
    height: 100%;
  }
</style>
